@import './../../assert/stylus/cube/variable.styl'
@import './../../assert/stylus/variable.styl'
@import './../../assert/stylus/mixin.styl'

.shopcart-container
  position absolute
  left: 0
  right: 0
  bottom: 0
  z-index: 2
  .shopcart
    height: 100%
    .content
      display: flex
      background $color-background
      font-size 0
      color $color-light-grey
      div
        text-align: left
      .content-left
        flex: 1
        .logo-wrapper
          display inline-block
          vertical-align top
          position relative
          top -10px
          margin 0 12px
          padding 6px
          width: 56px
          height: 56px
          box-sizing border-box
          border-radius 50%
          background $color-background
          .logo
            width 100%
            height 100%
            border-radius 50%
            text-align center
            background $color-dark-grey
            &.highlight
              background $color-blue
            .icon-shopping_cart
              line-height: 44px
              font-size $fontsize-large-xxx
              color $color-light-grey
              &.highlight
                color $color-white
          .num
            position absolute
            top 0
            right 0
        .price
          display inline-block
          vertical-align top
          margin-top 12px
          line-height 24px
          padding-right 12px
          box-sizing border-box
          border-right 1px solid rgba(255, 255, 255, 0.1)
          font-weight 700
          font-size $fontsize-large
          &.highlight
            color $color-white
        .desc
          display: inline-block
          vertical-align: top
          margin: 12px 0 0 12px
          line-height: 24px
          font-size: $fontsize-small-s
      .content-right
        flex 0 0 105px
        width 105px
        .pay
          height: 56px
          line-height: 56px
          text-align: center
          font-weight: 700
          font-size: $fontsize-small
          &.not-enough
            background: $color-dark-grey
          &.enough
            background: $color-green
            color: $color-white